<template>
    <div style="margin-top: 20px;">
        <div class="d-f jc-sb ai-c">
            <div>
                <p style="font-size: 20px;color: #2d8cf0;">
                    ▊ 我发起的
                </p>
            </div>
        </div>
        <div class="mt-10">
            <Table :columns="inProcessListColumns"
                   :data="inProcessListData"></Table>
            <Page
                    ref="currentPage"
                    :total="totalElements"
                    :page-size="size"
                    @on-change="changePage"
                    @on-page-size-change="changePageSize"
                    show-sizer
                    :page-size-opts="[5, 10, 20, 30, 40]"
                    show-total
                    style="margin-top:30px;text-align:center;"></Page>
            <Spin size="large" fix v-show="showSpin">
                {{spinMsg}}
            </Spin>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'inProcessList',
        data () {
            return {
                showSpin: false,
                spinMsg: '加载中，请稍后...',
                inProcessListColumns: [{
                    title: '序号',
                    key: 'statusName',
                    align: 'center',
                    width: 200,
                    render: (h, params) => {
                        return h('span', {
                            props: {}
                        }, params.row._index + 1);
                    }
                }, {
                    title: '操作',
                    key: 'action',
                    align: 'center',
                    width: 400,
                    render: (h, params) => {
                        let handleBtnName = '处理';
                        if (params && params.row && params.row.processNode && params.row.processNode.handleName) {
                            handleBtnName = params.row.processNode.handleName;
                        }
                        return h('div', [
                            h(params.row.statusCode === 'processing' ? 'Button' : '', {
                                props: {
                                    type: 'text',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '5px'
                                },
                                on: {
                                    click: () => {
                                        this.handleTask(params);
                                    }
                                }
                            }, handleBtnName),
                            h(params.row.statusCode === 'readyStart' ? 'Button' : '', {
                                props: {
                                    type: 'text',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '5px'
                                },
                                on: {
                                    click: () => {
                                        this.editMissionDetails(params.row.id, params.row.workflowInstance.procDefKey, params.row.workflowInstanceId);
                                    }
                                }
                            }, '编辑'),
                            h(params.row.statusCode === 'readyStart' ? 'Button' : '', {
                                props: {
                                    type: 'text',
                                    size: 'small'
                                },
                                style: {
                                    marginRight: '5px'
                                },
                                on: {
                                    click: () => {
                                        this.delMissionDetails(params.row.id);
                                    }
                                }
                            }, '删除')
                        ]);
                    }
                }, {
                    title: '流程名称',
                    key: 'workflowInstance.title',
                    align: 'center',
                    width: 775,
                    render: (h, params) => {
                        return h('span', {
                            props: {}
                        }, params.row.workflowInstance.title);
                    }
                }, {
                    title: '任务类型',
                    key: 'workflowInstance.processDefine.name',
                    align: 'center',
                    width: 280,
                    render: (h, params) => {
                        return h('span', {
                            props: {}
                        }, params.row.workflowInstance.processDefine.name);
                    }
                }, {
                    title: '发起时间',
                    key: 'workflowInstance.startTime',
                    align: 'center',
                    width: 220,
                    render: (h, params) => {
                        return h('span', {
                            props: {}
                        }, params.row.workflowInstance.startTime);
                    }
                }, {
                    title: '状态',
                    width: 370,
                    key: 'startStatusName',
                    align: 'center'
                }],
                inProcessListData: [],
                totalElements: 0,
                page: 0,
                size: 10
            };
        },
        mounted () {
            this.loadInProcessListData();
        },
        methods: {
            loadInProcessListData () {
                this.showSpin = true;
                let queryParams = {};
                queryParams.page = this.page;
                queryParams.size = this.size;

                depot.get({
                    url: this.URL.WORKFLOW.FIND_INPROCESS_TASK_LIST,
                    config: {
                        params: queryParams
                    },
                    cb: (data) => {
                        this.showSpin = false;
                        if (data.code === 0) {
                            if (data.data.content.length) {
                                this.inProcessListData = data.data.content;
                                this.size = data.data.size;
                                this.totalElements = data.data.totalElements;
                            }
                        } else if (data.code === 999) {
                            this.$Message.error(data.message);
                        }
                    },
                    ce: (error) => {
                        this.showSpin = false;
                    }
                });
            },
            goToBacklogModule (id) {
                if (!id) {
                    this.$Message.error('无法获取任务类型，请刷新后重试');
                    return;
                }
                this.$router.push({
                    name: 'missionDetails',
                    params: {
                        missionId: id
                    }
                });
            },
            // 翻页
            changePage (val) {
                this.page = val - 1;
                this.loadInProcessListData();
            },
            // 修改页面数据量
            changePageSize (val) {
                this.size = val;
                this.loadInProcessListData();
            },
            // 打开表单
            handleTask (taskInfo, btnType) {
                if (!taskInfo || !taskInfo.row) {
                    this.$Message.error('系统错误，获取任务信息失败！');
                }
                let processNode = taskInfo.row.processNode;
                if (!processNode) {
                    this.$Message.error('系统错误，获取任务信息失败！');
                }
                let processNodeId = processNode.id;
                if (!processNodeId) {
                    this.$Message.error('系统错误，获取任务信息失败！');
                }

                let queryParams = {};
                queryParams.taskInfoId = taskInfo.row.id;
                depot.get({
                    url: this.URL.WORKFLOW.FIND_CURRENT_FORM_LAYOUT_LIST_BY_TASK_INFO_ID,
                    config: {
                        params: queryParams
                    },
                    cb: (data) => {
                        if (data.code === 0) {
                            // TODO 获取表单布局

                            let formLayoutList = data.data;

                            if (!formLayoutList.length) {
                                this.$Message.error('未找到布局信息！');
                                this.closePage();
                                return;
                            }

                            if (formLayoutList.length > 0) {
                                formLayoutList.forEach((formLayout, formIndex) => {
                                    formLayout.formData = {};
                                    formLayout.layout = JSON.parse(formLayout.context);
                                    let rows = formLayout.layout.layout.rows;
                                    if (rows && rows instanceof Array && rows.length > 0) {
                                        rows.forEach((row) => {
                                            let cols = row.cols;
                                            if (cols && cols instanceof Array && cols.length > 0) {
                                                cols.forEach((col) => {
                                                    let type = col.type;
                                                    if (type && type === 'employeeSearch') {
                                                        // 获取员工信息
                                                        depot.get({
                                                            url: this.URL.USER.FIND_USER_LIST,
                                                            cb: (data) => {
                                                                if (data.code === 0) {
                                                                    this.userDbList = data.data;
                                                                } else if (data.code === 999) {
                                                                    this.$Message.error(data.message);
                                                                }
                                                            }
                                                        });
                                                    }
                                                });
                                            }
                                        });
                                    }
                                    formLayout.validateRule = {};
                                    let validateRules = formLayout.layout.validateRules;
                                    // 加工产生校验规则
                                    if (validateRules && validateRules.length > 0 && validateRules instanceof Array) {
                                        validateRules.forEach((validateRule) => {
                                            if (validateRule.rules && validateRule.rules instanceof Array) {
                                                validateRule.rules.forEach((rule) => {
                                                    if (rule && rule.hasOwnProperty('validator')) {
                                                        rule.validator = this[rule.validator];
                                                    }
                                                });
                                            }
                                            formLayout.validateRule[validateRule.key] = validateRule.rules;
                                        });
                                    }
                                });
                            }

                            let contentArr = formLayoutList;
                            let queryParams = {};
                            queryParams.taskInfoId = taskInfo.row.id;

                            depot.get({
                                url: this.URL.WORKFLOW.FIND_TASK_INFO_DETAIL,
                                config: {
                                    params: queryParams
                                },
                                cb: (data) => {
                                    this.showSpin = false;
                                    if (data.code === 0) {
                                        this.$Message.success('请求成功');

                                        // if (btnType === 'inProcessColumns') {
                                        data.data.workflowInstance.workflowFormItemList.forEach((workflowFormListItem, workflowFormListIndex) => {
                                            contentArr.forEach((contentArrItem, contentArrIndex) => {
                                                contentArrItem.formLayoutItemList.forEach((formLayoutItemListItem, formLayoutItemListIndex) => {
                                                    contentArrItem.layout.layout.rows.forEach((rowsItem, rowsIndex) => {
                                                        rowsItem.cols.forEach((colsItem, colsIndex) => {
                                                            if (workflowFormListItem.formLayoutItemId === formLayoutItemListItem.id && formLayoutItemListItem.labelKey === colsItem.key) {
                                                                if (colsItem.type === 'checkboxGroup') {
                                                                    let str = workflowFormListItem.labelValue;
                                                                    str = str.substring(1, str.length - 1);
                                                                    str = str.replace(/\"/g, '');
                                                                    let arr = str.split(',');
                                                                    contentArrItem.formData[workflowFormListItem.labelKey] = arr;
                                                                } else {
                                                                    contentArrItem.formData[workflowFormListItem.labelKey] = workflowFormListItem.labelValue;
                                                                }
                                                            }
                                                        });
                                                    });
                                                });
                                            });
                                        });
                                        // }

                                        // formLayoutList = contentArr;

                                        // TODO 获取打开方式
                                        let target = processNode.target;

                                        if (target) {
                                            if (target === 'modal') {
                                                this.showForm = true;
                                                this.currentTaskForm = processNode;
                                                this.currentFormLayoutList = formLayoutList;
                                                this.currentId = taskInfo.row.id;
                                                this.btnTypeStr = btnType;
                                            } else {
                                                let title = processNode.taskDefName;
                                                // util.openNewPage(this, 'taskFormTab', null, null, title);
                                                this.$router.push({
                                                    name: 'taskFormTab',
                                                    params: {
                                                        formlayoutList: formLayoutList,
                                                        processNode: processNode,
                                                        taskInfoId: taskInfo.row.id,
                                                        btnType: btnType
                                                    }
                                                });
                                            }
                                        }
                                    } else {
                                        this.$Message.error(data.message);
                                    }
                                },
                                ce: (error) => {
                                    this.showSpin = false;
                                }
                            });
                        } else if (data.code === 999) {
                            this.$Message.error(data.message);
                        }
                    },
                    ce: (error) => {
                        this.showSpin = false;
                    }
                });
            },
            // 编辑页面跳转
            editMissionDetails (missionId, procDefKey, workflowInstanceId) {
                if (!missionId) {
                    this.$Message.error('无法获取任务类型，请刷新后重试');
                    return;
                }
                this.$router.push({
                    name: 'missionEdit',
                    params: {
                        missionId: missionId,
                        procDefKey: procDefKey,
                        canStartProcessList: this.canStartProcessList,
                        workflowInstanceId: workflowInstanceId
                    }
                });
            },
            // 删除当前条目
            delMissionDetails (missionId) {
                if (!missionId) {
                    this.$Message.error('无法获取任务类型，请刷新后重试');
                }

                if (missionId) {
                    this.$Modal.confirm({
                        title: '确认提示',
                        content: '确认要删除吗？',
                        loading: true,
                        onOk: () => {
                            this.showSpin = true;
                            depot.post({
                                url: this.URL.WORKFLOW.DELETE_PROCESS_BY_TASK_INFO_ID + '?taskInfoId=' + missionId,

                                cb: (data) => {
                                    this.showSpin = false;
                                    if (data.code === 0) {
                                        this.$Message.info('删除成功');
                                        this.$Modal.remove();
                                        this.loadWaitingTask();
                                    } else if (data.code === 999) {
                                        this.$Message.error(data.message);
                                    }
                                },
                                ce: (error) => {
                                    this.showSpin = false;
                                }
                            });
                        },
                        onCancel: () => {
                            this.$Message.info('取消删除');
                        }
                    });
                }
            }
        }
    };
</script>

<style scoped>

</style>
